<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>index</title>
</head>
<body>
<div id="app">
    <table border="1px">
        <thead>
        <tr>
            <th>id</th>
            <th>deptName</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(p, index) in list" :key="p.id">
            <td>{{p.id}}</td>
            <td>{{p.deptName}}</td>
            <td>
                <a href="#" >编辑</a>
            </td>
        </tr>
        </tbody>
    </table>
</div>

<!--<script src="http://lib.baomitu.com/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>-->

<script type="text/javascript" src="js/vue.js"></script>
<script type="text/javascript" src="js/jquery.js"></script>

<script>
    let vm = new Vue({
        el: "#app",
        data: {
            list: [],
            deptModel: {
                id: '',
                deptName: '',
            },
        },
        created: function() {
            this.getAll()
        },
        methods: {
            getAll() {
                $.getJSON('dept/list', function (data) {
                    vm.list = data
                })
            },
        },
    })
</script>
</body>
</html>